JavaScript is a very forgiving language. It’s easy to write code that runs but has issues in it.
In this article, we’ll look at how we should write conditional statements in our JavaScript programs.
Write the Normal Path Through the Code First
We should take into account the normal paths first, then write the unusual cases.
So we should check the cases that are encounter more frequently than the rare edge cases.
Make Sure that we Branch Correctly on Equality
>= is different from > and also <= is different from < .
Therefore, we should make sure to avoid off-by-one errors by using the right one.
Put the Normal Case After the if Rather than After the else
The normal case is better after the if because it lets us run less code than if we put it in the else .
Short circuit evaluation means that we just run the if statement rather than checking the if statement and then going to the else .
If most cases are successes, then we should put the success case after the if rather than putting it after the else .
For instance, instead of writing:
if (status === 'error') {
//...
} else if (status === 'success') {
//...
} else {
//...
}
We flip the cases around by writing:
if (status === 'success') {
//...
} else if (status === 'error') {
//...
} else {
//...
}
With the error case on top, we can skip all the error cases that we’ve to check for if the status is 'success' .
We also know that the if case is always the normal successful case if we follow this convention.
Follow the if Clause with a Meaningful Statement
We shouldn’t have an if block that does nothing. So instead of writing:
if (condition) {
} else {
// ...
}
We should instead write:
if (!condition) {
//...
}
Consider the else Clause
We can use the else clause so that we take into conditions that aren’t taken into account for in the if block.
For instance, we may want to write:
if (MIN <= value && value <= MAX) {
// do something ...
} else {
// invalid value, do nothing
}
We may want to have the else block explains why we do nothing if the condition in the if isn’t met.
This way, we make sure that we didn’t ignore the case opposite of the condition in the if block.
Test the else Clause for Correctness
We want to test all cases for correctness in our program.
So we should test the else clause in addition to the if clause.
Check for Reversal of the if and else Clauses
We get unexpected results if we flip the if and else clauses.
Therefore, we should check if those clauses are flipped around.
Simplify Complicated Tests with Boolean Function Calls
If we have complex tests in our conditionals, we should put the expressions in a function so that we can just call the function.
The function name also makes everyone clear what the check is doing.
For instance, we can write the following to do that:
const inRange = (min, max, value) => (min <= value && value <= max);
if (inRange(min, max, value)) {
// ...
} else {
//...
}
We put the range checking code into a function and then called that.
Now we know that the boolean expressions are checking if value is in the given range of numbers as bound by min and max .
Put the Most Common Cases First
Since the most common cases are encountered the most frequently, we should put them first so most of the time, the less frequently encountered cases don’t have to be checked.
For instance, if letters are the most commonly encountered characters in ou if statement, then we can put that as the first case:
if (isLetter(input)) {
//...
} else if (isNumber(input)) {
///...
} else {
//...
}
This way, the first case will be the most common one and our program has to run the else clauses less often.
Conclusion
We can write conditional statements that are more efficient by putting the most frequently encountered cases first.
Also, we want to put complex boolean expressions into their own functions to make them clearer.
The normal case should go first since it’s encountered more frequently.
We should also use the right operator for comparison to reduce off-by-one errors.
